<template>
  <div>
    <!-- <x-header title="新闻详情" :left-options="{backText:''}"
                @on-click-back="$router.go(-1)">
    </x-header>-->
    <v-touch v-on:swiperight="onSwipeRight" :swipe-options="{direction: 'horizontal'}">
      <div>
        <x-header
          title="slot:overwrite-title"
          :left-options="{backText:'',preventGoBack:'true'}"
          @on-click-back="toPublichInfoList"
        >
          <div slot="overwrite-title" v-if="messageIndex == 2" class="my_title">新闻详情</div>
          <div slot="overwrite-title" v-else-if="messageIndex == 1" class="my_title">公告详情</div>
          <div slot="overwrite-title" v-else class="my_title">文件详情</div>
          <!-- <div slot="right">
            <img src="@/assets/img/share.png" @click="showShareType" style="width:20px;height:20px" />
          </div> -->
        </x-header>
        <div style="margin-top:10px">
          <div class="title" v-html="title"></div>
          <span class="datetime">{{datetime.substring(0,10)}}</span>
          <div v-html="content" class="data-content"></div>
        </div>
        <div style="width:100%;height:20px;background-color:#f5f5f5"></div>
        <footer class="footer">
          <div class="attachment">正文附件</div>
          <!--@click="checkFile(i.fileId, i.fileOldName, i.fileSize)-->
          <div v-if="fileNameItem.length > 0" class="file">
            <!-- <img src="../../svg/pdf.svg" alt="" class="file-icon">
            <div>
            <div class="file-name">{{i.fileOldName}}</div>
            <div class="file-size">{{i.fileSize}} KB</div>
            </div>-->
            <picture-upload v-model="fileNameItem[0].fieldToken" :readonly="true"></picture-upload>
          </div>
          <div v-if="fileNameItem.length == 0">
            <div class="no-attachment">暂无附件</div>
          </div>
          <div class="attachment">其他附件</div>
          <!--@click="checkFile(i.fileId, i.fileOldName, i.fileSize)-->
          <div v-if="otherFileNameItem.length > 0" class="file">
            <!-- <img src="../../svg/pdf.svg" alt="" class="file-icon">
            <div>
            <div class="file-name">{{i.fileOldName}}</div>
            <div class="file-size">{{i.fileSize}} KB</div>
            </div>-->
            <picture-upload v-model="otherFileNameItem[0].fieldToken" :readonly="true"></picture-upload>
          </div>
          <div v-if="otherFileNameItem.length == 0">
            <div class="no-attachment">暂无附件</div>
          </div>
        </footer>
        <actionsheet v-model="showShare" :menus="shareMenu" :theme="theme" @on-click-menu="share"></actionsheet>
        <router-view style="height:100%;"></router-view>
      </div>
    </v-touch>
  </div>
</template>

<script>
import { Actionsheet } from "vux";
export default {
  name: "publicDetailInfo",

  mounted() {
    this.obj = this.$route.query.item;
    this.getFileName(this.contentattachmentid);
    this.getOtherFileName(this.attachmentid);
    this.changeContent();
  },
  components: {
    Actionsheet
  },
  data() {
    return {
      obj: [],
      fileNameItem: [],
      messageIndex: this.$route.query.messageIndex,
      title: this.$route.query.title,
      datetime: this.$route.query.datetime,
      content1: this.$route.query.content,
      contentattachmentid: this.$route.query.contentattachmentid,
      attachmentid: this.$route.query.attachmentid,
      content: "",
      otherFileNameItem: [],
      folder: this.$route.query.folder,
      home: this.$route.query.home,
      showShare: false,
      theme: "android",
      shareMenu: {
        menu1: "分享给朋友",
        menu2: "分享至朋友圈",
        menu3: "取消"
      }
    };
  },

  methods: {
    share(menuKey, menuItem) {
      var shareTitle = this.title;
      var shareUrl = process.env.BASE_URL + "#" + this.$route.fullPath;
      var shareText = this.content;
      console.log();
      document.addEventListener("deviceready", function() {
        sharesdk.isInstallClient
          .promise(ShareSDK.ClientType.Wechat)
          .then(function(isInstall) {
            if (isInstall) {
              if (menuKey == "menu1") {
                var platformType = ShareSDK.PlatformType.WechatSession; //微信好友分享
                // alert(platformType)
                var icon = "https://github.com/zhaolin0801/cordova-sharesdk-demo/blob/master/www/img/Wechat-QRcode.jpeg?raw=true";
                // alert(icon)
                var title = shareTitle;
                // alert(title)
                var text = "shareText";
                // alert(text)
                var url = process.env.BASE_URL;
                // alert(url)
                var shareInfo = {
                  icon: icon,
                  title: title,
                  text: text,
                  url: url
                };
                // alert(shareInfo)
                sharesdk.share(
                  platformType,
                  ShareSDK.ShareType.WebPage,
                  shareInfo,
                  function(success) {
                    alert("成功",success)
                  },
                  function(fail) {
                    alert("失败",JSON.stringify(fail))
                  }
                );
              } else if (menuKey == "menu2") {
                var platformType = ShareSDK.PlatformType.WechatTimeline; //朋友圈分享
                var icon = require("../../assets/img/logo.png");
                var title = shareTitle;
                var text = shareText;
                var url = shareUrl;
                var shareInfo = {
                  icon: icon,
                  title: title,
                  text: text,
                  url: url
                };
                sharesdk.share(
                  platformType,
                  ShareSDK.ShareType.WebPage,
                  shareInfo,
                  function(success) {},
                  function(fail) {}
                );
              } else {
                this.showShare = false;
              }
            } else {
              alert("未安装微信客户端");
            }
          },false);
      });
    },
    showShareType() {
      this.showShare = true;
      if (this.judgeDeviceType().isIOS) {
        this.theme = "ios";
      }
    },
    onSwipeRight() {
      if (this.folder != undefined) {
        this.$router.push({
          path: "/publicInfo/folderDetail",
          name: "folderDetail",
          params: {
            messageIndex: this.messageIndex,
            item: this.folder
          }
        });
      } else {
        this.$router.push({
          path: "/publicInfo",
          name: "publicInfo",
          query: {
            messageIndex: this.messageIndex
          }
        });
      }
    },
    toPublichInfoList() {
      //console.log(this.folder);
      if (this.folder != undefined) {
        this.$router.push({
          path: "/publicInfo/folderDetail",
          name: "folderDetail",
          params: {
            messageIndex: this.messageIndex,
            item: this.folder
          }
        });
      } else if (this.home != undefined) {
        this.$router.go(-1);
      } else {
        this.$router.push({
          path: "/publicInfo",
          name: "publicInfo",
          query: {
            messageIndex: this.messageIndex
          }
        });
      }
    },
    //富文本转换为html可读文本
    changeContent() {
      console.log("obj", this.content1);
      //console.log("messageinde",this.messageIndex)
      // var tempStr = this.obj.CONTENT.replace(/&lt;/g,"<")
      var tempStr = this.content1.replace(/&lt;/g, "<");
      var tempStr1 = tempStr.replace(/&gt;/g, ">");
      this.content = tempStr1.replace(
        /img src="/g,
        'img src="' + process.env.BASE_URL + ""
      );
      //console.log("content",this.content);
    },
    //附件信息
    getFileName(fileToken) {
      //console.log(this.messageIndex)
      var params =
        `{"_method":"streamSupportService.getAttachmentInfos","_param":[{"fieldToken":"` +
        fileToken +
        `"}]}`;
      this.$ajax({
        url: this.COMMON_URL,
        method: "post",
        data: {
          FixJSON: params
        }
      }).then(res => {
        this.fileNameItem = res.data.attachments;
        console.log("fileName", this.fileNameItem);
      });
    },
    //其他附件信息
    getOtherFileName(fileToken) {
      var params =
        `{"_method":"streamSupportService.getAttachmentInfos","_param":[{"fieldToken":"` +
        fileToken +
        `"}]}`;
      this.$ajax({
        url: this.COMMON_URL,
        method: "post",
        data: {
          FixJSON: params
        }
      }).then(res => {
        this.otherFileNameItem = res.data.attachments;
        console.log("otherFileNameItem", this.otherFileNameItem);
      });
    },
    checkFile(fileId, name, size) {
      var url =
        "http://qhszpm.simulate.com:8080/qhszpm/servlet/StreamSupportAction.cmd?type=%27customerDownloadService%27&FixJSON=%7B_method%3A%27streamSupportService.getAttachment%27%2C_param%3A%7BattachmentId%3A" +
        fileId +
        "%7D%7D";

      this.$router.push({
        path: "/publicInfo/fileInfo",
        name: "noticeFileInfo",
        params: {
          name: name,
          size: size,
          url: url
        }
      });
    }
  }
};
</script>

<style scoped>
.title {
  font-size: 18px;
  font-family: PingFangSC-Regular;
  font-weight: 400;
  color: #191919;
  line-height: 26px;
  margin-left: 5%;
  margin-right: 5%;
}
.datetime {
  font-size: 12px;
  font-family: PingFangSC-Regular;
  font-weight: 400;
  color: #999999;
  line-height: 20px;
  margin-left: 5%;
}
.data-content {
  font-size: 14px;
  font-family: PingFangSC-Regular;
  font-weight: 400;
  color: #333333FF;
  line-height: 28px;
  margin: 10px 15px;
}
/* .footer{
  padding-top: 16px;
} */
.attachment {
  font-size: 16px;
  font-family: PingFangSC-Regular;
  font-weight: 400;
  color: #191919;
  line-height: 28px;
  margin-left: 5%;
  margin-top: 3%;
}
.no-attachment{
  font-size: 14px;
  font-family: PingFangSC-Regular;
  font-weight: 400;
  color: #999999FF;
  line-height: 28px;
  margin: 10px 15px;
}
.file {
  display: flex;
  align-items: center;
  position: relative;
  padding-bottom: 16px;
  margin-top: 5%;
}
.file-icon {
  width: 32px;
  height: 32px;
  margin-left: 5%;
}
.file-name {
  margin-left: 16px;
  font-size: 12px;
  color: #343434;
}
.file-size {
  font-size: 11px;
  color: #9f9f9f;
  margin-left: 16px;
}
.my_title {
  margin-top: 4%;
  font-size: 18px;
  font-family: PingFangSC-Semibold;
  font-weight: 600;
  color: #ffffff;
  /* line-height:20px; */
}
/* .transition-view /deep/ .vux-header{
    background-color: #ffffff !important;
  }
  .transition-view /deep/ .vux-header .vux-header-title > span{
    font-size:18px;
    font-family:PingFangSC-Semibold;
    font-weight:600;
    line-height:20px;
    color: #262A34;
  }
  .transition-view /deep/ .vux-header .vux-header-left .left-arrow:before{
    border-color: #cccccc;
  }  */
.transition-view .vux-header /deep/ .vux-header-title-area,
.vux-header .vux-header-title {
  margin: auto;
}
</style>
